<template>
	<view class="MyOrder">
		<topbar-my-order></topbar-my-order>
		<view class="MyOrder-top"></view>
		<list-title @orderStatus="orderStatus"></list-title>
		<scroll-view scroll-y="true" class="scroll-Y">
			<order-underway :orderUnderway="orderUnderway" @receive="receive"></order-underway>
			<order-finish :orderFinish="orderFinish" @removeOrder="removeOrder"></order-finish>
		</scroll-view>
	</view>
</template>

<script>
	import topbarMyOrder from "./childMyOrder/topbarMyOrder.vue"
	import ListTitle from "./childMyOrder/ListTitle.vue"
	import OrderUnderway from "./childMyOrder/OrderUnderway.vue"
	import OrderFinish from "./childMyOrder/OrderFinish.vue"
	
	import {getOrder,postReceive,postRemoveOrder} from "network/orderMsg.js"
	
	export default{
		onLoad() {
			this._getOrder(0)
		},
		components:{
			topbarMyOrder,
			ListTitle,
			OrderUnderway,
			OrderFinish
		},
		data() {
			return {
				orderUnderway:[],
				orderFinish:[]
			}
		},
		computed:{
			
		},
		methods:{
			orderStatus(index){
				this._getOrder(index)
			},
			_getOrder(index){
				this.orderUnderway=[]
				this.orderFinish=[]
				getOrder(index).then(res=>{
					if(res.data.code == 70000){
						let result = res.data.result
						result.forEach(e=>{
							if(e.status == 1)  this.orderUnderway.push(e)
							else if (e.status == 2) this.orderFinish.push(e)
						})
					}
				})
			},
			receive(e){
				postReceive(e).then(res=>{
					if(res.data.code == 80000){
						uni.showToast({
						    title: res.data.msg,
						    duration: 2000,
							icon:'none'
						})
						setTimeout(()=>{
							uni.redirectTo({
								url:"../../childMine/myOrder/MyOrder"
							})
						},1000)
					}
				})
			},
			removeOrder(e){
				postRemoveOrder(e).then(res=>{
					if(res.data.code == 90000){
						uni.showToast({
						    title: res.data.msg,
						    duration: 2000,
							icon:'none'
						})
						setTimeout(()=>{
							uni.redirectTo({
								url:"../../childMine/myOrder/MyOrder"
							})
						},1000)
					}
				})
			}
		}
	}
</script>

<style scoped>
	.MyOrder{
		position: relative;
		height: 100vh;
	}
	.MyOrder-top{
		background-color: #0C34BA;
		height: 200rpx;
		width: 100%;
	}
	.scroll-Y{
		position: absolute;
		top: 355rpx;
		left: 0rpx;
		right: 0rpx;
		bottom: 20rpx;
		width: 90%;
		margin: 0rpx 40rpx;
		background-color: #FFFFFF;
	}
</style>
